<script setup lang="ts">

import {ref} from "vue";
import {useHotInfomation} from "../hooks/useHotInfomation.ts";

const img = ref<string>('src/components/assets/hot.png')

const {hotList} = useHotInfomation()
</script>

<template>
  <div class="hot-box">
    <div class="header-top">
      <el-image class="header-png" :src="img"/>
      <el-text class="header-text">热点</el-text>
    </div>
    <div class="hot-list">
      <div class="hot-item" v-for="item in hotList">
        <div class="hot-item-title">
          <a href="#">{{ item.title }}</a>
        </div>
        <div class="hot-item-content">
          <a href="#"> {{ item.content }}</a>
        </div>
      </div>
    </div>
  </div>
</template>

<style scoped lang="scss">
@import "style/HotInfomation";
</style>